import {
  LocalizationContext,
  MinimalButton,
  Position,
  Tooltip,
} from "../../core";

import PreviousIcon from "./PreviousIcon";
import { RenderGoToPageProps } from "./types/index";
import { FC, useContext } from "react";

const TOOLTIP_OFFSET = { left: 0, top: 8 };

const GoToPreviousPageButton: FC<RenderGoToPageProps> = ({
  isDisabled,
  onClick,
}) => {
  const l10n = useContext(LocalizationContext);
  const label =
    l10n && l10n.pageNavigation
      ? l10n.pageNavigation.goToPreviousPage
      : "Previous page";

  return (
    <Tooltip
      position={Position.BottomCenter}
      target={
        <MinimalButton isDisabled={isDisabled} onClick={onClick}>
          <PreviousIcon />
        </MinimalButton>
      }
      content={() => label}
      offset={TOOLTIP_OFFSET}
    />
  );
};

export default GoToPreviousPageButton;
